{% extends "account/account_base.html" %}
{% block title %}外部账户{% endblock %}
{% block head %} 
{{ super() }}
<link rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap-table.min.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='css/select2.min.css') }}">
{% endblock %}
{% block page_content %}

<h1 class="page-header">商家账户审批</h1>
<div class="col-md-12">
			<div style="background-color:#F2F2F2;height:40px;line-height:40px;font-size:20px;">申请信息</div>
	    		<div class="col-md-8">
				<div style="margin-top:10px;">
		    			<div class="col-md-2" style="font-size:20px;"><center>申请时间</center></div>
		    			<div class="col-md-5" style="font-size:20px;">{{ upgrade.submission_time }}</div>
				</div>
			</div>
			<div class="col-md-8">
				<div style="margin-top:15px;">
	    				<div class="col-md-2" style="font-size:20px;"><center>公司名称</center></div>
			    		<div class="col-md-5" style="font-size:20px;">{{ upgrade.company_name }}</div>
				</div>
			</div>
			<div class="col-md-8">
				<div style="margin-top:15px;">
	    				<div class="col-md-2" style="font-size:20px;"><center>法人姓名</center></div>
			    		<div class="col-md-5" style="font-size:20px;">{{ upgrade.corporation_name }}</div>
				</div>
			</div>
			<div class="col-md-8">
				<div style="margin-top:15px;">
	    				<div class="col-md-2" style="font-size:20px;"><center>公司地址</center></div>
			    		<div class="col-md-5" style="font-size:20px;">{{ upgrade.company_address }}</div>
				</div>
			</div>
			<div class="col-md-8">
				<div style="margin-top:15px;">
	    				<div class="col-md-2" style="font-size:20px;"><center>公司电话</center></div>
			    		<div class="col-md-5" style="font-size:20px;">{{ upgrade.company_tel }}</div>
				</div>
			</div>
			<div class="col-md-8">
				<div style="margin-top:15px;">
	    				<div class="col-md-2" style="font-size:20px;"><center>公司简介</center></div>
			    		<div class="col-md-5" style="font-size:20px;">{{ upgrade.intro }}</div>
				</div>
			</div>
			<div class="col-md-8">
				<div style="margin-top:15px;">
	    				<div class="col-md-2" style="font-size:20px;"><center>营业执照</center></div>
			    		<div class="col-md-5" style="font-size:20px;">{{ upgrade.business_license }}</div>
				</div>
			</div>
			<div class="col-md-8">
				<div style="margin-top:15px;">
	    				<div class="col-md-2" style="font-size:20px;"><center>联系人</center></div>
			    		<div class="col-md-5" style="font-size:20px;">{{ upgrade.contact_name }}</div>
				</div>
			</div>
			<div class="col-md-8">
				<div style="margin-top:15px;">
	    				<div class="col-md-2" style="font-size:20px;"><center>联系电话</center></div>
			    		<div class="col-md-5" style="font-size:20px;">{{ upgrade.contact_phone }}</div>
				</div>
			</div>
			<div class="col-md-8">
				<div style="margin-top:15px;">
	    				<div class="col-md-2" style="font-size:20px;"><center>所在地区</center></div>
			    		<div class="col-md-5" style="font-size:20px;">{{ upgrade.area }}</div>
				</div>
			</div>
			{% if upgrade.application_type == 1 %}
			<div style="margin-top:20px;background-color:#F2F2F2;height:40px;line-height:40px;font-size:20px;">原账户信息</div>
	    		<div class="col-md-8">
				<div style="margin-top:10px;">
		    			<div class="col-md-2" style="font-size:20px;"><center>ID</center></div>
		    			<div class="col-md-5" style="font-size:20px;">{{ user.user_number }}</div>
				</div>
			</div>
			<div class="col-md-8">
				<div style="margin-top:15px;">
	    				<div class="col-md-2" style="font-size:20px;"><center>姓名</center></div>
			    		<div class="col-md-5" style="font-size:20px;">{{ user.name }}</div>
				</div>
			</div>
			<div class="col-md-8">
				<div style="margin-top:15px;">
	    				<div class="col-md-2" style="font-size:20px;"><center>联系电话</center></div>
			    		<div class="col-md-5" style="font-size:20px;">{{ user.phone }}</div>
				</div>
			</div>
			<div class="col-md-8">
				<div style="margin-top:15px;">
	    				<div class="col-md-2" style="font-size:20px;"><center>所在地区</center></div>
			    		<div class="col-md-5" style="font-size:20px;">{{ user.area }}</div>
				</div>
			</div>
			<div class="col-md-8">
				<div style="margin-top:15px;">
			    		<div class="col-md-2" style="font-size:20px;"><center>注册时间</center></div>
	    				<div class="col-md-5" style="font-size:20px;">{{ user.register_date.strftime("%Y-%m-%d %H:%M:%S") }}</div>
				</div>
			</div>
			{% endif %}
			<div class="col-md-8" style="margin-top:20px">
				<center>
					<button type="button" class="btn btn-success" data-toggle="modal" data-target="#PassModal" >通过</button>	
					<button type="button" class="btn btn-danger" data-toggle="modal" data-target="#RejectModal" >拒绝</button>
				</center>
			</div>
		</div>
</div>

<div class="modal fade" id="PassModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				<h4 class="modal-title" id="myModalLabel">通过申请</h4>
			</div>
			<div class="modal-body">
				<center>确定通过该申请吗？</center>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-success" onclick="pass()">确定</button>
				<button type="button" class="btn btn-danger" data-dismiss="modal" aria-hidden="true">取消</button>
			</div> 
		</div>
	</div><!-- /.modal-dialog -->
</div>

<div class="modal fade" id="RejectModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				<h4 class="modal-title" >拒绝商家申请</h4>
			</div>
			<div class="modal-body">
				<form role="form" id="FreezeForm">
					<label for="reason">拒绝原因</label>
					<textarea class="form-control" id="reason" name="reason" cols=20 rows=5 required></textarea>
					<input type='hidden' name='number' id='number'>
				</form>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-success" onclick="reject()">确定</button>
				<button type="button" class="btn btn-danger" data-dismiss="modal" aria-hidden="true">取消</button>
			</div> 
		</div>
	</div><!-- /.modal-dialog -->
</div>

{% endblock %}
{% block scripts  %}
{{ super() }}
<script src="{{ url_for('static', filename='js/bootstrap-table.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/bootstrap-table-zh-CN.min.js') }}"></script>
<script>
$(function () {

    //初始化Table
    var tb_buy = new TableInit("tb_buy");
    tb_buy.Init();
    var tb_rent = new TableInit("tb_rent");
    tb_rent.Init();
    var tb_finance = new TableInit("tb_finance");
    tb_finance.Init();
    var tb_invalid = new TableInit("tb_invalid");
    tb_invalid.Init();

});


var TableInit = function (table_id) {
    var oTableInit = new Object();
    var urls = new Array();
    urls['tb_buy'] = "/account/outside/details/get_list/?list_type=buy&uid={{uid}}";
    urls['tb_rent'] = "/account/outside/details/get_list/?list_type=rent&uid={{uid}}";
    urls['tb_finance'] = "/account/outside/details/get_list/?list_type=finance&uid={{uid}}";
    urls['tb_operation'] = "/account/outside/individual/get_list/?state=0";
    urls['tb_invalid'] = "/account/outside/details/get_list/?list_type=invalid&uid={{uid}}";

    //初始化Table
    table = document.getElementById(table_id);
    oTableInit.Init = function () {
	var columns;
	if(table_id==='tb_invalid'){
		columns = [{
		    field: 'freeze_time',
		    title: '冻结时间',
		    align: 'center',
		}, {
                    field: 'freeze_name',
                    title: '冻结操作人',
                    align: 'center',
            	},{
                    field: 'reason',
                    title: '冻结原因',
		    align: 'center',
           	 }, {
                    field: 'recovery_name',
                    title: '恢复操作人',
                    align: 'center',
                },{
                    field: 'recovery_time',
                    title: '恢复时间',
		    align: 'center',
           	},];
	}
	else{
		columns = [{
		    field: 'number',
		    title: 'ID',
		    align: 'center',
	   	 }, {
                    field: 'title',
                    title: table_id==="tb_buy" ? '车辆信息' : '产品信息',
                    align: 'center',
            	},{
                    field: 'phone',
                    title: '联系电话',
		    align: 'center',
            	}, {
                    field: 'time',
                    title: '提交时间',
		    align: 'center',
            	}, {
		    field: 'area',
		    title: '地区',
		    align: 'center',
	    	}, {
                    field: 'state',
                    title: '状态',
                    align: 'center',
            	},{
                    field: 'operate',
                    title: '操作',
                    align: 'center',
                    formatter: function(value){
			    link = '<a href="/tracking/track' + value + '" title="查看用户信息">查看</a>';
		            return link;
		    },
           	},];
	}

        $(table).bootstrapTable({
            url: urls[table_id],                //请求后台的URL（*）
            method: 'get',                      //请求方式（*）
            toolbar: '#toolbar',                //工具按钮用哪个容器
            striped: true,                      //是否显示行间隔色
            cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            pagination: true,                   //是否显示分页（*）
            sortable: false,                     //是否启用排序
            sortOrder: "asc",                   //排序方式
            queryParams: oTableInit.queryParams,//传递参数（*）
            sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
            pageNumber:1,                       //初始化加载第一页，默认第一页
            pageSize: 10,                       //每页的记录行数（*）
            pageList: [10, 25, 50, 100],        //可供选择的每页的行数（*）
            search: true,                       //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
            strictSearch: true,
            showColumns: true,                  //是否显示所有的列
            showRefresh: true,                  //是否显示刷新按钮
            minimumCountColumns: 2,             //最少允许的列数
            clickToSelect: true,                //是否启用点击选中行
            height: 500,                        //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
            uniqueId: "ID",                     //每一行的唯一标识，一般为主键列
            showToggle:true,                    //是否显示详细视图和列表视图的切换按钮
            cardView: false,                    //是否显示详细视图
            detailView: false,                   //是否显示父子表
            columns: columns,
        });
    };

    return oTableInit;
};

var pass = function(){
	var div = document.getElementById('msg');
        $.ajax({
            url: "/account/outside/review/pass/",
            type: "POST",
	    data: {'number': "{{ upgrade.number }}" },
            dataType:"text",
            success: function(data) {

                $('#PassModal').modal('hide');
                json = eval("("+data+")");
		state = json.state;
        	if(json.state === 0){
		    $('#msg_icon').removeAttr('class');
		    $('#msg_icon').attr('class', 'glyphicon glyphicon-ok-sign');
		    $("#msg").html("操作成功！");
                }
		else{
		    $('#msg_icon').removeAttr('class');
		    $('#msg_icon').attr('class', 'glyphicon glyphicon-remove-sign');
  		    $('#msg').html("操作失败，" + json.msg);
		}
            },
	    error: function(xhr, error){
		state = -1;
		$('#msg_icon').removeAttr('class');
		$('#msg_icon').attr('class', 'glyphicon glyphicon-remove-sign');
		$('#msg').html("操作失败，服务器发生错误");
	    }
        });
	$('#MsgModal').modal();
	return;
};

var reject = function(){
	var div = document.getElementById('msg');
	reason = document.getElementById('reason').value;
	if(reason===""){
		div.innerHTML = "请填写拒绝原因";	
                $('#MsgModal').modal();
		return;
	}
        $.ajax({
            url: "/account/outside/review/reject/",
            type: "POST",
	    data: {'number': "{{ upgrade.number }}", 'reason': reason },
            dataType:"text",
            success: function(data) {

                $('#RejectModal').modal('hide');
                json = eval("("+data+")");
		state = json.state;
        	if(json.state === 0){
		    $('#msg_icon').removeAttr('class');
		    $('#msg_icon').attr('class', 'glyphicon glyphicon-ok-sign');
		    $("#msg").html("操作成功！");
                }
		else{
		    $('#msg_icon').removeAttr('class');
		    $('#msg_icon').attr('class', 'glyphicon glyphicon-remove-sign');
  		    $('#msg').html("操作失败，" + json.msg);
		}
            },
	    error: function(xhr, error){
		state = -1;
		$('#msg_icon').removeAttr('class');
		$('#msg_icon').attr('class', 'glyphicon glyphicon-remove-sign');
		$('#msg').html("操作失败，服务器发生错误");
	    }
        });
	$('#MsgModal').modal();
	return;
};

$(document).ready(function(){
	$('#MsgModal').on('hidden.bs.modal', function () {
		if(state === 0){
			window.location.href = '/account/outside/company/list/'
		}
	});
});

</script>
<script>
    $('#nav_user').attr("class", "active");
</script>
{% endblock %}
